* {
    margin: 0;
    padding: 0;
}

html {
    font-size: 26.6667vw;
}

/* <!-- 头部 --> */
#header {
    width: 3.75rem;
    height: .62rem;
    position: relative;
}

.font {
    width: .14rem;
    height: .24rem;
    display: block;
    position: absolute;
    top: .21rem;
    left: .23rem;
    list-style: none;
}

.font img {
    width: .14rem;
    height: .24rem;
    display: block;
}

#head-right {
    width: 1.88rem;
    height: .62rem;
    float: right;
}

#head-right ul {
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    position: relative;
    top: .21rem;
}

#head-right ul .icon {
    width: .25rem;
    height: .28rem;
    list-style: none;
}

#head-right ul .icon img {
    display: block;
    width: .25rem;
    height: .28rem;
}

#head-right ul .icon .warn {
    width: .38rem;
    height: .38rem;
    position: absolute;
    top: -.055rem;
    left: .1rem;
}

.background img {
    width: 3.75rem;
    height: 2.22rem;
    opacity: 0.5;
}

/* <!-- 漫画 --> */
#cartoon {
    width: 3.75rem;
    height: 2.22rem;
    /* background-color: rgb(74, 30, 233); */
    border-bottom: 1px solid #f2f2f2;
    position: relative;
    display: flex;
    flex-direction: row;
    justify-content: space-around;
}

.cover {
    width: 1.49rem;
    height: 1.88rem;
    position: absolute;
    top: .22rem;
    left: .12rem;

}

.cover img {
    width: 1.49rem;
    height: 1.88rem;
    border: 2px solid #fff;
    border-radius: 15px;
}

/* .info {
    width: 1.49rem;
    height: 1.88rem;
    float: right;
    right: .43rem;
    top: .22rem;
    position: absolute;
} */

.comic {
    width: 1.49rem;
    height: 1.88rem;
    float: right;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    /* background-color: chartreuse; */
    right: .43rem;
    top: .22rem;
    position: absolute;
}

.comic .font p {
    width: .72rem;
    height: .26rem;
    font-size: .2rem;
    font-weight: 600;
    left: -.24rem;
    top: -0.22rem;
    position: absolute;
}

.comic-title {
    width: 1rem;
    border-bottom: .2rem;
    font-size: .15rem;
    top: 0.5rem;
    position: absolute;
}

.comic-title p {
    width: 1rem;
    padding-bottom: .2rem;
}

.comic-num {
    font-size: .15rem;
    top: 1rem;
    position: absolute;
}

.comic-red {
    font-size: .15rem;
    top: 1rem;
    left: .4rem;
    position: absolute;
}

/* <!-- 简介 --> */
#intro {
    width: 3.75rem;
    height: 2.12rem;
    position: relative;
    border-bottom: 1px solid #f2f2f2;
}

.type {
    width: 160px;
    height: .15rem;
    font-size: .15rem;
    /* background-color: beige; */
    left: .21rem;
    top: .28rem;
    position: absolute;
}

.type span {
    font-size: .15rem;
    font-weight: 700;
}

.type p {
    float: right;
}

.summary {
    width: 3.4rem;
    height: .15rem;
    font-size: .15rem;
    top: .61rem;
    left: .21rem;
    position: absolute;
    text-align: left;
}

.summary span {
    font-size: .15rem;
    font-weight: 700;
}

/* <!-- 目录 --> */
#table {
    width: 3.75rem;
    height: 1.7rem;
    position: relative;
    border: 1px solid #f2f2f2;
}

.list {
    width: 3.75rem;
    height: .51rem;
    font-size: .15rem;
    top: .2rem;
    left: .2rem;
    position: absolute;
}

.list span {
    font-weight: 700;
}

.list p {
    font-size: .1rem;
    color: #9a9a9a;
    display: inline
}

.list a {
    text-decoration: none;
    right: .42rem;
    position: absolute;
    color: #01e188;
}

.list-chap {
    width: 3.75rem;
    height: .8rem;
    font-size: .15rem;
    top: .7rem;
    left: .2rem;
    position: absolute;
}

.list-chap img {
    width: 1.5rem;
    height: .8rem;
    border-radius: .1rem;
}

.list-chap span {
    right: 1.1rem;
    top: .17rem;
    position: absolute;
}

.list-chap p {
    color: #9a9a9a;
    display: inline-block;
    right: 65px;
    top: .45rem;
    position: absolute;
}

/* <!-- 评论 --> */
#remark {
    width: 3.75rem;
    height: 2.5rem;
    border: 1px solid #f2f2f2;
    position: relative;
}

.comment {
    width: 3.75rem;
    font-size: .15rem;
    top: .2rem;
    left: .2rem;
    position: absolute;
}

.comment span {
    font-weight: 700;
}

.comment p {
    font-size: .1rem;
    color: #9a9a9a;
    display: inline
}

.comment img {
    width: .2rem;
    height: .25rem;
    float: right;
    right: .42rem;
    position: absolute;
}

.user {
    width: 3.35rem;
    font-size: .15rem;
    top: .5rem;
    left: .2rem;
    position: absolute;
}

.user .box ul {
    width: 3.35rem;
    height: .67rem;
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    list-style: none;
    padding-top: .1rem;
    padding-bottom: .2rem;
    border-bottom: 1px solid #f2f2f2;
}

.user .box img {
    width: .4rem;
    height: .4rem;
    border-radius: 50px;
    border: 1px solid #f2f2f2;
}
.user .box div {
    /* float: right; */
}
.user .box .name {
    color: #9a9a9a;
    float: left;
    margin: 0 0 0 .1rem;
    /* left: .5rem;
    top: .1rem;
    position: absolute; */
}

.user .box .time {
    color: #9a9a9a;
    float: left;
    margin: .2rem 0 0 -0.75rem;
    /* left: .5rem;
    top: .3rem;
    position: absolute;  */
    
}

.user .box .part {
    float: left;
    margin-top: .15rem;
    /* top: .5rem;
    position: absolute; */
}

/* <!-- 功能区 --> */
.funtion {
    width: 3.75rem;
    height: 0.5rem;
    top: .2rem;
    position: absolute;
}

.fun-icon {
    width: 2rem;
    /* height: 0.8rem; */
}

.fun-icon ul {
    width: 2rem;
    /* height: .8rem; */
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    position: relative;
    left: -0.1rem;
    /* float: left; */
}

.fun-icon li {
    width: .35rem;
    /* height: .8rem; */
    top: -0.05rem;
    list-style: none;
    text-align: center;
    position: relative;
}

.fun-icon img {
    width: .4rem;
    height: .4rem;
    top: .1rem;
    /* left: .1rem; */
    position: absolute;
}

.fun-icon p {
    width: .7rem;
    font-size: .15rem;
    top: .5rem;
    position: absolute;
}
.btn .btn-read{
    width: 150px;
    height: 80px;
    background: #01e188;
    border: 0;
    color: #fff;
    top: 0.01rem;
    position: relative;
    float: right;
}

